import React, {Component} from 'react';
import {
    MenuUnfoldOutlined,
    MenuFoldOutlined,
    UserOutlined,
    VideoCameraOutlined,
    UploadOutlined,
} from '@ant-design/icons';
import {connect} from "react-redux";
import './index.less'
import {toggleSideBar} from "../../store/actions";

class ToggleTrigger extends Component {



    toggle = () => {
        this.props.toggleSideBar();

    };

    render() {
        return (
            <div className="toggle-container">
                    {this.props.sidebarCollapsed ?
                // {this.state.sidebarCollapsed ?
                    <MenuUnfoldOutlined
                        className="trigger"
                        onClick={this.toggle}
                    />
                    :
                    <MenuFoldOutlined
                        className="trigger"
                        onClick={this.toggle}
                    />}
            </div>
        );
    }
}

const mapStateToProps = (state) => {
    return {...state.app};
};
export default connect(mapStateToProps, {toggleSideBar})(ToggleTrigger);
